<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!-- Bootstrap用到的HTML元素和CSS属性需要HTML5 doctype。因此每个使用Bootstrap的页面都应该包启HTML5声明。-->

<html lang="zh-CN">
<!-- lang属性表示当前文档显示的语言，在很多国际化的网站中会遇到，zh-CN定义语言为中文，en定义语言为英语 -->
<!-- html lang="zh-CN"解决Mac版Firefox中文字体显示问题，Bootstrap也建议加上 -->
<head>
<title>便民医疗服务</title>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<link rel="stylesheet" href="${pageContext.request.contextPath}/assets/layui/css/layui.css">
<script src="${pageContext.request.contextPath}/assets/layer/layer.js"></script>
<script src="${pageContext.request.contextPath}/assets/layui/layui.js"></script>
<link rel="shortcut icon" href="${pageContext.request.contextPath}/assets/images/logo-icon.jpg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link type="text/css" href="${pageContext.request.contextPath}/assets/css/bootstrap.min2.css"
	rel="stylesheet" />
<link type="text/css" href="${pageContext.request.contextPath}/assets/css/bootstrap-switch.css"
	rel="stylesheet">
<style>
* {
	font-family: "微软雅黑", "黑体", "宋体";
}

.space_lg {
	height: 50px;
	clear: both;
	text-align: right;
}

.space_md {
	height: 30px;
	clear: both;
}

.space_sm {
	height: 10px;
	clear: both;
}

.space_demo {
	border-bottom: 1px solid black;
}

@media ( min-width : 768px) {
	.container {
		width: 750px;
	}
	#scrollDiv {
		left: 0px;
	}
}

@media ( min-width : 992px) {
	.container {
		width: 990px;
	}
	#scrollDiv {
		left: 0px;
	}
}

@media ( min-width : 1200px) {
	.container {
		width: 1200px;
	}
}

@media ( min-width : 1400px) {
	.container {
		width: 1350px;
	}
}

@media ( min-width : 1800px) {
	.container {
		width: 1750px;
	}
	#scrollDiv {
		left: 180px;
	}
}

.lnk-tools {
	position: fixed;
	bottom: 180px;
	right: 80px;
	_position: absolute;
	z-index: 999;
	_top: expression(documentElement.scrollTop);
}

.lnk-tools button {
	width: 100px;
}
</style>
</head>

<body data-target="#scrollDiv" data-offset="0" data-spy="scroll">



	<!-- 导航栏 -->
	<div class="navbar navbar-default navbar-fixed-top" role="navigation">
		<div class="container">
			<div class="navbar-header">
				<a class="navbar-brand" href="javascript:void(0);"><span
					class="glyphicon glyphicon-home"></span> 医生主页</a>
			</div>

			<ul class="nav navbar-nav navbar-right">
				<li style="background-color: #555;"><a
					href="javascript:void(0);"><span
						class="glyphicon glyphicon-user"></span>
						&nbsp;&nbsp;${doctor.getDoctorname()}医生&nbsp;&nbsp;</a></li>
				<li class="dropdown" style="background-color: #2c7659;"><a
					href="javascript:void(0);" class="dropdown-toggle"
					data-toggle="dropdown"> <span
						class="glyphicon glyphicon-screenshot"></span> 常用系统操作<span
						class="caret"></span>
				</a>
					<ul class="dropdown-menu" role="menu">
						<li><a href="javascript:void(0);">检索功能</a></li>
						<li><a href="javascript:void(0);">视图切换</a></li>
						<li><a href="javascript:void(0);">进入门户</a></li>
						<li class="divider"></li>
						<li><a href="javascript:void(0);">注销退出</a></li>
					</ul></li>
			</ul>
		</div>
	</div>

	<div class="container" style="margin-top: 80px;">
		<div class="row">
			<div class="col-md-8" style="width: 100%">
				<div class="jumbotron" style="height: 120px; padding: 10px;">
					<div class="row">
						<div class="col-md-2">
							<img src="${pageContext.request.contextPath}/assets/${doctor.doctorImg}" style="height: 100px;width: 150px"
								class="img-thumbnail">
						</div>
						<div class="col-md-7" style="margin-left: -30px">
							<h3 class="text-info">
								${doctor.doctorname}医生&nbsp;<input type="hidden" id="doctorId" value="${doctor.doctorid}"><input type="hidden" id="outpatientservicetypeId" value="${doctor.outpatientservicetypeid}"><span class="label label-warning">${doctor.doctorsex}</span>&nbsp;&nbsp;<span
									class="label label-primary">医龄${doctor.jobtime}年</span>
							</h3>
							<span class="text-info"><strong>所属部门：</strong></span><span
								class="text-primary">${doctor.outPatientServiceTypeName}</span>&nbsp;<strong>|</strong>&nbsp;
							
						</div>
					</div>
				</div>
			</div>
			<div style="margin-bottom: 20px">
				<input type="text" placeholder="查找病人" id="serach"
					style="margin-left: 15px; width: 60%; height: 40px"> <input
					type="button" id="serachbtn" value="搜索"
					style="border: 0; margin-left: -4px; height: 40px; width: 58px; background-color: #2894FF; color: white;">

			</div>

		</div>
		<div class="row">
			<div class="col-md-12">
				
				<div id="myTabContent" class="tab-content">

					<!-- 第一块操作区 -->
					<div class="tab-pane fade in active" id="myLi1">
						<div id="myLi11">
							<div class="space_sm"></div>
							<div class="row">
							
							
								<div class="col-md-8">
									<div class="row">
										<div class="col-md-12">
											<div class="panel panel-warning">
												<div class="panel-heading"
													style="background-color: #fcf8e3; border-color: #faebcc; color: #8a6d3b;">
													<h3 class="panel-title"
														style="color: #8a6d3b; font-family: 微软雅黑">病人基本信息</h3>
												</div>
												<div class="panel-body">
													<span class="text-info"><strong>患者姓名：</strong></span><span
														class="text-primary" id="patientName"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>年龄：</strong></span><span
														class="text-primary" id="patientAge"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>性别：</strong></span><span
														class="text-primary" id="patientSex"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>身份证：</strong></span><span
														class="text-primary" id="patientIdentIty"></span><input type="button" value="就诊记录" id="openm" style="float: right;background-color: red;color: white;border: 0"> <br> <span
														class="text-info"><strong>民族：</strong></span><span
														class="text-primary" id="patientNation"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>联系电话：</strong></span><span
														class="text-primary" id="patientTel"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>地址：</strong></span><span
														class="text-primary" id="patientAddress"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>亲属：</strong></span><span
														class="text-primary" id="patientRelationName"></span>&nbsp;<strong>|</strong>&nbsp;
													<span class="text-info"><strong>亲属联系方式：</strong></span><span
														class="text-primary" id="patientRelationTel"></span>
														<input type="button" id="openc" value="开具处方" data-toggle='modal' data-target='#Mymodal3' contenteditable='true' style="margin-top:10px;float: right;background-color: #2894FF;color: white;border: 0">
												</div>
												
											</div>
										</div>
									</div>
									<div class="space_sm"></div>
									<div class="row">
										<div class="col-md-12">
											<ul id="myTab4" class="nav nav-tabs">
												<li class="active"><a href="#" data-toggle="tab" >就诊记录</a></li>
											</ul>
											<div id="myTabContent" class="tab-content">
												<div class="tab-pane fade in active" id="reco1">
													<div class="space_md"></div>
													<div style="overflow-y: scroll;width: 100%;height: 200px;">
													<table class="table" id="medicalList">
														<thead>
															<tr>
																<th>病症</th>
																<th>时间</th>
																<th>操作</th>
															</tr>
														</thead>
														<tbody id="tbody">
														
														</tbody>
													</table>
													</div>
													<!-- 开方遮罩开始 -->
													<div class="modal fade" tabindex="-1" role="dialog"
														id="Mymodal3" style="height: 500px">
														<div class="modal-dialog" role="document">
															<div class="modal-content"
																style="height: 500px; margin-top: -30px">
																<div class="modal-header">
																	<button type="button" class="close"
																		data-dismiss="modal" aria-label="Close">
																		<span aria-hidden="true">&times;</span>
																	</button>
																	<h4 class="modal-title">开具处方</h4>
																</div>
																<div class="modal-body">
																	<!-- 内容部分 -->
																	<form class="form-horizontal" role="form">
																		<div class="form-group">
																		<label for="prescription">诊断病症</label><input type="text"
																				class="form-control" name="diseaseName"
																				id="diseaseName" style="height: 40px; width: 585px"
																				placeholder="请输入诊断病症" />
																		</div>
																		<div class="form-group">
																		<input type="hidden" id="tcId">
																			<label for="prescription">处方</label> <select
																				id="medicineType" name="medicineType"
																				style="width: 181px"></select> <select id="medicineName"
																				name="medicineName" style="width: 181px"></select>
																				<label for="medicineNum">数量&nbsp</label><input id="medicineNum" type="number" min="1" style="width: 150px" value="1"/>
																		</div>
																		<div class="form-group">
																			<label for="medicalOrders">医嘱</label> <input type="text"
																				class="form-control" name="medicalOrders"
																				id="medicalOrders" style="height: 40px; width: 585px"
																				placeholder="请输入用量、禁忌等信息" />
																		</div>
																		<button type="button" class="btn btn-default"
																			id="addm" style="float: right;">添加</button>
																			<div class="form-group">
																			<table class="table">
																				<thead>
																					<tr>
																						<th>药品</th>
																						<th>数量</th>
																						<th>医嘱</th>
																					</tr>
																				</thead>
																				<tbody id="tAddMe">
																					
																				</tbody>
																			</table>
																		</div>
																		<button type="button" class="btn btn-default"
																			id="sub" style="bottom: 5px;right: 15px;position: fixed;">提交</button>
																	</form>
																	<!-- 内容部分 -->
																</div>
															</div>
															<!-- /.modal-content -->
														</div>
														<!-- /.modal-dialog -->
													</div>
													<!-- /.modal -->
													<!-- 开方遮罩结束 -->
													<!-- 查方遮罩开始 -->
													<div class="modal fade" tabindex="-1" role="dialog"
														id="Mymodal" style="height: 500px">
														<div class="modal-dialog" role="document">
															<div class="modal-content"
																style="height: 500px; margin-top: -30px">
																<div class="modal-header">
																	<button type="button" class="close"
																		data-dismiss="modal" aria-label="Close">
																		<span aria-hidden="true">&times;</span>
																	</button>
																	<h4 class="modal-title">用药</h4>
																</div>
																<div class="modal-body">
																	<input type="hidden" id="id" name="id">
																	<!-- 内容部分 -->
																			<table class="table">
																				<thead>
																					<tr>
																						<th>药品</th>
																						<th>数量</th>
																						<th>医嘱</th>
																					</tr>
																				</thead>
																				<tbody id="tMedicine">
																					
																				</tbody>
																			</table>
																		</div>
																	<!-- 内容部分 -->
																</div>
															</div>
															<!-- /.modal-content -->
														</div>
														<!-- /.modal-dialog -->
													</div>
													<!-- /.modal -->
													<!-- 查方遮罩结束 -->
												</div>
												
											</div>
										</div>
										<!-- /.col-记录 -->
									</div>
								</div>
								
								
								
							</div>
						</div>
					</div>

				</div>
			</div>
		</div>
	</div>

	<div class="modal fade" id="modalTest" tabindex="-1" role="dialog">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title">登录平台</h4>
				</div>
				<div class="modal-body">
					<p>One fine body&hellip;</p>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
					<button type="button" class="btn btn-primary">Save changes</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->

	<div class="modal fade" id="modalTest2" tabindex="-1" role="dialog">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title">检验报告</h4>
				</div>
				<div class="modal-body">
					<p>红细胞沉淀率测定&hellip;</p>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->

	<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/switch-need1.js"></script>
	<script type="text/javascript"
		src="${pageContext.request.contextPath}/assets/js/bootstrap-switch.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/switch-need2.js"></script>
	<script>
		$(function() {
			var patientTel = $("#patientTel").text();
			if (patientTel==null||patientTel=="") {
				$("#openc").hide();
				$("#openm").hide();
			}
			$('#modalTest').modal({
				backdrop : true,//true:有遮罩背景&点击可关闭modal;false:没遮罩&不可点击关闭;'static':有遮罩不可点击关闭（默认是true）
				keyboard : true,//键盘上的esc键被按下时关闭模态框（默认是true）
				show : false,//模态框初始化之后就立即显示出来（默认是true）
			});
			$('#switch-offColor').on('switchChange.bootstrapSwitch',
					function(event, state) {
						if (state) {
							$("#myLi22").show();
							$("#myLi21").hide();
						} else {
							$("#myLi21").show();
							$("#myLi22").hide();
						}
						console.log(this); // DOM element
						console.log(event); // jQuery event
						console.log(state); // true | false
					});

			$('#switch-offColor2').on('switchChange.bootstrapSwitch',
					function(event, state) {
						if (state) {
							$("#myLi32").show();
							$("#myLi31").hide();
						} else {
							$("#myLi31").show();
							$("#myLi32").hide();
						}
						console.log(this); // DOM element
						console.log(event); // jQuery event
						console.log(state); // true | false
					});
			$("#serachbtn").click(function () {
				var serach = $("#serach").val();
				if(serach==null||serach==""){
					layer.msg('您还未输入病患号码', {
						icon: 7
					});
				}else{
				$.ajax({
					type:"get",
					url:"${pageContext.request.contextPath }/selPatient/"+serach,
					dataType: 'json',
					success : function(result) {
						$("#openc").show();
						$("#openm").show();
						$("#tbody").empty();
						$("#tbody").hide();
						$("#openm").attr({"disabled":false});
						layer.msg('查询到病患'+result.patientname, {
							icon: 1
						});
						$("#patientName").html(result.patientname);
						$("#patientAge").html(result.patientage);
						$("#patientSex").html(result.patientsex);
						$("#patientIdentIty").html(result.patientidentity);
						$("#patientNation").html(result.patientnation);
						$("#patientTel").html(result.patienttel);
						$("#patientAddress").html(result.patientaddress);
						$("#patientRelationName").html(result.patientrelationname);
						$("#patientRelationTel").html(result.patientrelationtel);
					},
					error : function () {
						layer.msg('未查询到病患', {
							icon: 3
						});
					}
				});
				}
			});
			$("#tbody").hide();
			$("#openm").click(function () {
				var patientTel = $("#patientTel").text();
				$("#tbody").toggle(500);
				$.ajax({
					type:"get",
					url:"${pageContext.request.contextPath }/selPatientByTel/"+patientTel,
					dataType: 'json',
					success : function (result) {
						if (result==null||result=="") {
							layer.msg('无就诊记录', {
								icon: 7
							});
						}else{
						layer.msg('已显示就诊记录', {
							icon: 6
						});
						$("#openm").attr({"disabled":"disabled"});
						var list = eval(result);
						$(list).each(function (index) {
							var val = list[index];
							$("#tbody").append("<tr class='active'><td>"+val.diseaseName+"</td><td>"+val.medicalDate+"</td><td><input type='button' class='selMedicine' value='查看用药' data-toggle='modal' data-target='#Mymodal' contenteditable='true' style='background-color: #2894FF; color: white; border: 0' /></td><td><input type='hidden' value="+val.patientSituationId+"></td></tr>")
						});
					}
					}
				});
			});
			
			$(document).on('click','.selMedicine',function () {
				$("#tMedicine").empty();
				var psId = $(this).parents("tr").find("td").eq(3).find("input").val();
				$.ajax({
					type:"get",
					url:"../selMedicine/"+psId,
					dataType: 'json',
					success : function (result) {
						var list = eval(result);
						$(list).each(function (index) {
							var val = list[index];
							$("#tMedicine").append("<tr><td>"+val.medicineName+"</td><td>"+val.tmedicinenum+"</td><td>"+val.medicalOrders+"</td>")
						});
					}
				});
			});
			
			
			var date = new Date();
			var tcId = date.getMinutes().toString()+date.getSeconds().toString();
			$("#openc").click(function () {
				$.ajax({
					type:"post",
					url:"../selMedicineType",
					dataType: 'json',
					success : function (result) {
						$("#medicineType").empty();
						$("#tcId").val(tcId);
						var list = eval(result);
						$(list).each(function (index) {
							var val = list[index];
							$("#medicineType").append("<option>"+val.medicinetype+"</option>")
						});
					}
				});
			});
			
			$("#medicineType").change(function () {
				$("#medicineName").empty();
				var type = $("#medicineType").val();
				$.ajax({
					type:"post",
					url:"../selMedicineByType/"+type,
					dataType: 'json',
					success : function (result) {
						var list = eval(result);
						$(list).each(function (index) {
							var val = list[index];
							$("#medicineName").append("<option>"+val.medicinename+"</option>");
							$("#medicineNum").attr({"max":val.medicinenum});
						});
					}
				});
			});
			
			$("#medicineNum").change(function () {
				var max = $("#medicineNum").attr("max");
				var num = $("#medicineNum").val();
				if(num==max){
					layer.msg('你skr魔鬼吧，要超过库存啦', {
						icon: 7
					});
				}
			});
			$("#medicineNum").blur(function () {
				var max = $("#medicineNum").attr("max");
				var num = $("#medicineNum").val();
				if(num*1>max*1){
					$("#medicineNum").val(max);
					layer.msg('你skr魔鬼吧，超过库存啦', {
						icon: 7
					});
				}
				if (num<1) {
					$("#medicineNum").val("1");
					layer.msg('你skr魔鬼吧，不给病人药吃吗', {
						icon: 7
					});
				}
			});
			
			$("#addm").click(function () {
				var medicineName = $("#medicineName").val();
				var medicineNum = $("#medicineNum").val();
				var medicalOrders = $("#medicalOrders").val();
				if (medicalOrders==null||medicalOrders=="") {
					layer.msg('请输入药品用量、禁忌', {
						icon: 7
					});
				}else{
					$.ajax({
						type:"post",
						url:"../addPre",
						contentType : "application/json",
						data:JSON.stringify({
						"tcid" : $("#tcId").val(),
						"medicineName" : $("#medicineName").val(),
						"tmedicinenum" : $("#medicineNum").val(),
						"medicalOrders" : $("#medicalOrders").val(),
						}),
						dataType : 'json',
						success : function (result) {
							$("#medicalOrders").val("")
							$("#tAddMe").append("<tr><td>"+medicineName+"</td><td>"+medicineNum+"</td><td>"+medicalOrders+"</td></tr>");
						}
					});
				}
			});
			
			$("#sub").click(function () {
				var diseaseName = $("#diseaseName").val();
				if (diseaseName==null||diseaseName=="") {
					layer.msg('请输入病症', {
						icon: 7
					});
				}else{
					$.ajax({
						type:"post",
						url:"../addMH",
						contentType : "application/json",
						data:JSON.stringify({
						"doctorId" : $("#doctorId").val(),
						"outPatientServiceTypeId" : $("#outpatientservicetypeId").val(),
						"tcid" : $("#tcId").val(),
						"diseaseName" : $("#diseaseName").val(),
						"patientTel" : $("#serach").val(),
						}),
						dataType : 'json',
						success : function (result) {
							layer.msg('提交成功', {
							icon: 1
							});
							$("#Mymodal3").modal("hide");
						}
					});
				}
			});
			
			
		});
	</script>
</body>
</html>
